<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
		<style type="text/css">
			div {
				/*
				 表示固定位置
				 * */
				position: fixed;
				width: 320px;
				right: 0;
				bottom: 0;
			}
			
			img {
				/*
				 解决两张图片中间的间隙
				 * */
				display: block;
			}
			
			span {
				width: 20px;
				height: 20px;
				position: absolute;
				right: 0;
				top: 0;
				/*
				 把默认的光标，变成小手
				 * */
				cursor: pointer;
			}
		</style>
	</head>

	<body>
		<div class="box">
			<img src="img/up.png" />
			<img src="img/down.png" />
			<span></span>
		</div>
	</body>
	<script type="text/javascript">
		$('span').click(function() {
			//			alert('关闭')
			$('.box').animate({
				'bottom': '-165px'
			}, 2000).animate({
				'right': '-320px'
			},2000,function(){
				alert('性能很好')
			})
		})
	</script>

</html>